<div>
  <div class="nav">
    <a routerLink="/">首页</a>
    <label>我的文件</label>
  </div>
  <div *ngIf="!loading">
    <div class="flex wrap">
      <div class="topo" *ngFor="let item of data.list">
        <div class="image" (click)="onOpen(item)">
          <img [appImgAuthSrc]="item.image" />
        </div>
        <div class="ph15 pv10">
          <i class="iconfont icon-delete hover" (click)="onDel(item)"></i>
          <div class="title line one" title="点击访问" (click)="onOpen(item)">{{ item.name }}</div>
          <div class="desc line two mt5" [title]="'[双击可修改] ' + item.desc" (dblclick)="onEditDesc($event, item)">
            <span *ngIf="!item.edited">{{ item.desc }}</span>
            <textarea
              *ngIf="item.edited"
              name="desc"
              class="input"
              rows="2"
              [(ngModel)]="desc"
              (mousedown)="$event.stopPropagation()"
              (keydown)="onEnterDesc($event)"
              title="回车：保存修改；Ctrl + 回车：换行"
              required
            ></textarea>
          </div>
          <div class="flex mt5">
            <div
              class="full line one"
              [title]="
                '更新时间：' +
                (item.updatedAt | date: 'yyyy-MM-dd HH:mm:ss') +
                '\n创建时间：' +
                (item.createdAt | date: 'yyyy-MM-dd HH:mm:ss')
              "
            >
              <i class="iconfont icon-clock"></i>
              {{ item.updatedAt | date: 'yyyy-MM-dd HH:mm:ss' }}
            </div>
            <span class="ml15" title="点赞数">
              <i class="iconfont icon-appreciate"></i>
              <span class="ml5">{{ item.star || 0 }}</span>
            </span>
            <a
              class="ml15"
              title="文件历史"
              routerLink="/user/history"
              [queryParams]="{ id: item.id, name: item.name }"
            >
              <i class="iconfont icon-sort" style="font-size: .14rem"></i>
            </a>
          </div>
        </div>
      </div>
    </div>
    <div class="p10 mb30" *ngIf="data.count">
      <ui-pagination
        [(pageIndex)]="search.pageIndex"
        [(pageCount)]="search.pageCount"
        [pageTotal]="data.count"
        [options]="{ pageCount: false }"
      ></ui-pagination>
    </div>

    <div *ngIf="!data.count" class="text-center gray mt50">
      您还没有任何文件！
      <a class="hover" routerLink="/">开始创建我的图文</a>
    </div>
  </div>
  <ui-loading
    *ngIf="loading"
    class="mt50"
    tip="正在加载，请稍等（个人云服务器资源小，人多可能慢，欢迎资助）..."
  ></ui-loading>
</div>
